<template>
  <div>
    <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogFormVisible" style="width:80%;margin:0 auto 40px;">
      <el-form :rules="rules" ref="dataForm" :model="temp" label-position="right" label-width="100px" style='width: 300px; margin-left:30px;'>
        <el-form-item
          prop="parentPermission"
          label="父权限:"
        >
          <el-input v-model="temp.parentPermission" size="mini"></el-input>
          <!--
          <el-dropdown size="small" split-button type="primary" @click="handleClick" v-model="temp.parentPermission">
            父权限
            <el-dropdown-menu slot="dropdown">
              <el-dropdown-item>用户管理</el-dropdown-item>
              <el-dropdown-item>组织管理</el-dropdown-item>
              <el-dropdown-item>角色管理</el-dropdown-item>
              <el-dropdown-item>模块管理</el-dropdown-item>
              <el-dropdown-item>权限管理</el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
          -->

        </el-form-item>
        <el-form-item
          prop="permissionName"
          label="权限名称:"
          :rules="[
            { required: true, message: '请输入权限名称', trigger: 'blur' }
          ]"
        >
          <el-input v-model="temp.permissionName" size="mini"></el-input>
        </el-form-item>
        <el-form-item :model="temp"
          prop="permissionCode"
          label="权限编码:"
        >
          <el-input v-model="temp.permissionCode" size="mini"></el-input>
        </el-form-item>
        <el-form-item :model="temp"
           prop="permissionUri"
           label="权限uri:"
        >
          <el-input v-model="temp.permissionUri" size="mini"></el-input>
        </el-form-item>
        <el-form-item :model="temp"
          label="权限路径:"
          prop="permissionUrl">
          <el-input v-model="temp.permissionUrl" size="mini"></el-input>
        </el-form-item>
        <el-form-item
          label="所属模块:"
          prop="permissionModule">
          <el-dropdown size="small" split-button type="primary" @click="handleClick" v-model="temp.permissionMoudle">
            所属模块
            <el-dropdown-menu slot="dropdown">
              <el-dropdown-item>用户管理</el-dropdown-item>
              <el-dropdown-item>组织管理</el-dropdown-item>
              <el-dropdown-item>角色管理</el-dropdown-item>
              <el-dropdown-item>模块管理</el-dropdown-item>
              <el-dropdown-item>权限管理</el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
        </el-form-item>
        <el-form-item
          label="权限类型:"
          prop="permissionType"
          :rules="filter_rules({required:true,maxLength:200})">
          <el-input v-model="temp.permissionType" size="mini"></el-input>
        </el-form-item>
        <el-form-item
          label="是否菜单:"
          prop="isMenu">
          <el-radio v-model="radio" label="1">是</el-radio>
          <el-radio v-model="radio" label="2">不是</el-radio>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible = false">取 消</el-button>
        <el-button v-if="dialogStatus=='create'" type="primary" @click="createData">确 定</el-button>
        <el-button v-else type="primary" @click="updateData">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script type="text/javascript">
  import ElButton from '../../../node_modules/element-ui/packages/button/src/button.vue'

  export default {
    components: {ElButton},
    data () {
      return {
        activeName: 'first',
        temp: {
          id: undefined,
          importance: 1,
          remark: '',
          timestamp: new Date(),
          title: '',
          type: '',
          status: 'published'
        },
        textMap: {
          update: '修改权限',
          create: '新建权限'
        },
        dialogStatus: 'update',
        dialogFormVisible: false,
        dialogPvVisible: false,
        rules: {
          type: [{ required: true, message: 'type is required', trigger: 'change' }],
          timestamp: [{ type: 'date', required: true, message: 'timestamp is required', trigger: 'change' }],
          title: [{ required: true, message: 'title is required', trigger: 'blur' }]
        },
        filterText: '',
        defaultProps: {
          children: 'children',
          label: 'label'
        }
      }
    },
    methods: {
      handleClick () {

      },
      createPermissionDialog () {
        this.dialogStatus = 'create'
        this.dialogFormVisible = true
      },
      modifyPermissionDialog (data) {
        this.dialogStatus = 'update'
        this.dialogFormVisible = true
        this.temp = data
      },
      createData () {
      },
      updateData () {
      },
      filterNode (value, data) {
        if (!value) return true
        return data.label.indexOf(value) !== -1
      }
    },
    watch: {
      filterText (val) {
        this.$refs.tree2.filter(val)
      }
    }
  }
</script>

<style>

</style>
